<template>
    <div class="continer">
        <div class="title">
            <img src="@/assets/images/service1.png" alt="">
            <span>服务人员</span>
        </div>
        <div class="peopleBox">
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
        </div>
        <div class="title">
            <img src="@/assets/images/service2.png" alt="">
            <span>设计团队</span>
        </div>
        <div class="peopleBox">
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
        </div>
        <div class="title">
            <img src="@/assets/images/service4.png" alt="">
            <span>工程人员</span>
        </div>
        <div class="peopleBox">
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
            <div class="people">
                <div class="left">
                    <span class="span1">张先生</span>
                    <span class="span2">| 商务经理</span>
                </div>
                <div class="right">
                    <img src="@/assets/images/service3.png" alt="">
                    <span class="span3">400-9999-137</span>
                </div>
            </div>
        </div>

        <!-- 底部 -->
        <empty-tabbar></empty-tabbar>
        <tabbar></tabbar>
    </div>
</template>
<script>
import Tabbar from '@/pages/home/components/Tabbar'
import emptyTabbar from '@/pages/home/components/emptyTabbar'

export default {
    name: 'serviceStaff',
    components: {
        Tabbar,emptyTabbar
    }
}
</script>
<style lang="stylus" scoped>
.continer
    display flex
    align-items center
    flex-direction column
    .title
        width 100%
        height 100px
        display flex
        align-items center
        background #f6f6f6
        box-sizing border-box
        padding-left 50px
        img 
            width 42px
            height 42px
            margin-right 16px
        span
            line-height 33px
            font-size 33px
            color #333333
            font-weight bold
            letter-spacing 4px
    .peopleBox
        background #ffffff
        display flex
        align-items center
        flex-direction column
        padding 30px 0
        .people
            width 640px
            height 60px
            display flex
            align-items center
            justify-content space-between
            border-bottom 1px solid #efefef;/*no*/
            .left
                .span1
                    line-height 27px
                    font-size 27px
                    font-weight bold
                    color #333333
                .span2
                    font-size 22px
                    color #666666
            .right
                img 
                    width 42px
                    height 42px
                    margin-right 16px
                .span3
                    font-size 28px
                    color #a90017
        .people:last-child
            border-bottom none


</style>
